<template>
  <div>
    <a-table :columns="columns" :data-source="data" :scroll="{ y: 200 }">
      <template #bodyCell="{ column, record }">
        <template v-if="column.key === 'oprate'">
          <a-select
            ref="select"
            v-model:value="record.处理状态"
            style="width: 90px"
            :options="status"
            :field-names="{ label: 'value', value: 'key' }"
            @select="(value) => handkeSelect(value, record.FID)"
          ></a-select>
        </template>
      </template>
    </a-table>
  </div>
</template>

<script setup>
import { defineProps } from 'vue'
const props = defineProps({
  data: {
    type: Array,
  },
})
const EmitStatus = defineEmits(['changeStatus'])
const columns = [
  {
    title: '序号',
    dataIndex: 'FID',
    key: 'FID',
    width: 55,
  },
  {
    title: '事件编号',
    dataIndex: '事件编号',
    key: 'code',
    width: 120,
  },
  {
    title: '事件类型',
    dataIndex: '事件类型',
    key: 'type',
    width: 75,
  },
  {
    title: '事件等级',
    dataIndex: '事件等级',
    key: 'level',
    width: 75,
  },
  {
    title: '发生时间',
    key: 'time',
    dataIndex: '发生时间',
    width: 100,
  },
  {
    title: '发生地点',
    key: 'address',
    dataIndex: '发生地点',
    width: 150,
  },
  {
    title: '车牌号',
    dataIndex: '车牌号',
    key: 'number',
    width: 100,
  },
  {
    title: '驾驶员',
    dataIndex: '驾驶员',
    key: 'driver',
    width: 80,
  },
  {
    title: '操作',
    key: 'oprate',
    width: 80,
  },
]
let status = [
  { key: '0', value: '未处理' },
  { key: '1', value: '已忽略' },
  { key: '2', value: '已归档' },
]
const handkeSelect = (value, FID) => {
  EmitStatus('changeStatus', { value, FID })
}
</script>

<style></style>
